<section class="section">
  <div class="container">

    <h1 class="title is-3 fancy"><%= gettext("Companies") %></h1>
    <div class="tabs is-centered">
      <%= form_tag "#", method: "get", phx_change: :search  %>
        <div class="columns is-desktop">
          <div class="column">
            <div class="field">
              <label class="field" for="search[text]"><%= gettext("Text") %></label>
              <div class="control">
                <div class="text">
                  <input name="search[text]" id="search[text]" class="input" type="text" placeholder="Name or Industry" value="<%= @text %>"/>
                </div>
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>
    <div class="content">
      <div id="company-index" class="columns is-mobile is-multiline" phx-update="<%= @update %>" data-page="<%= @page %>" phx-hook="InfiniteScroll">
        <%= for company <- @companies do %>
          <div id="company-<%= company.id %>" class="column is-full-mobile is-half-tablet is-one-third-desktop is-one-quarter-widescreen">
            <%= render "card.html", company: company, conn: @socket %>
          </div>
        <% end %>
      </div> <!-- /columns -->
    </div> <!-- /content -->

  </div> <!-- /container -->
</section>
